<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

</head>
<body class="gray-bg">
	<div class="wrapper wrapper-content">
		<div class="row animated fadeInRight">
			<div class="col-sm-12">
				<div class="ibox float-e-margins">
					<div class="ibox-title">
						<h5>查询条件</h5>
					</div>
					<div class="ibox-content">
						<form id="queryForm" class="form-inline">
							<div class="form-group">
								<input type="text" name="likeName" id="likeName" placeholder="角色或者角色名称" class="form-control">
							</div>
							<div class="form-group">
								<button class="btn btn-outline btn-primary btn-lg" id="queryBtn" style="margin-left: 20px" type="button">
									<i class="fa fa-search"></i>&nbsp;查询
								</button>
								<button class="btn btn-outline btn-default btn-lg" id="queryBtn" style="margin-left: 20px" type="reset">
									<i class="fa fa fa-recycle"></i> &nbsp;清空
								</button>
							</div>
						</form>
					</div>
				</div>
				<div class="ibox-content forum-container">
					<div id="toolbar" class="btn-group">
						<button class="btn btn-outline btn-primary" id="addBtn" style="margin-left: 20px" type="button">
							<i class="fa fa-plus"></i>&nbsp;新增
						</button>
					</div>
					<table id="queryTable"></table>

				</div>
			</div>
		</div>

		<script type="text/javascript">
			function queryTable() {
				$("#queryTable").bootstrapTable('refresh');
			}

			$(function() {
				var oTable = new TableInit();
				oTable.Init();
				$("#queryBtn").click(function() {
					queryTable();
				});

				$("#addBtn").click(function() {
					openWindows('新增', "${"$"}{ctx}/${viewDir}/addPage", '600px');
				});

			});
			var TableInit = function() {
				var oTableInit = new Object();
				//初始化Table
				oTableInit.Init = function() {
					var config = bootstrapTableConfig();
					config.url = '${"$"}{ctx}/role/list';
							config.queryParams = oTableInit.queryParams,// 传递参数（*）
							config.columns = [
									//	{checkbox : false},
									{
										//field: 'Number',//可不加  
										title : '序号',//标题  可不加  
										formatter : function(value, row, index) {
											return index + 1;
										}
									},
									{
										field : 'id',
										title : '操作',
										width : '120px',
										formatter : function(value, row, index) {
											return '<button class="btn btn-default btn-circle" type="button" data-toggle="tooltip" data-placement="bottom" title="查看详情" onclick="detail(\''
													+ value
													+ '\')"><i class="fa fa-ellipsis-h"></i></button>'
													+ '&nbsp;'
													+ '<button class="btn btn-warning btn-circle" type="button" data-toggle="tooltip" data-placement="bottom" title="修改" onclick="edit(\''
													+ value
													+ '\')"><i class="fa fa-edit"></i></button>'
													+ '&nbsp;'
													+ '<button class="btn btn-danger btn-circle" type="button" data-toggle="tooltip" data-placement="bottom" title="删除" onclick="deleteInfo(\''
													+ value + '\')"><i class="fa fa-remove"></i></button>';
										}
									}
								<#list table.columnList as column>
								<#if column.columnName?uncap_first=="updateBy"||column.columnName?uncap_first=="updateDate">
								     , {
										field : '${column.columnName?uncap_first}UserName',
										title : '操作人'
									}
								<#else>
									, {
										field : '${column.columnName?uncap_first}',
										title : '${column.columnLabel}'
									}
								</#if>
								</#list>	
		  							];
					$('#queryTable').bootstrapTable(config);
				};
				//得到查询的参数
				oTableInit.queryParams = function(params) {
					var form = formToJson("queryForm");
					form.limit = params.limit;
					form.offset = params.offset;
					return form;
				};
				return oTableInit;
			};
			function detail(id) {
				openWindows('查看', "${"$"}{ctx}/${viewDir}/viewPage?id=" + id);
			}
			function edit(id) {
				openWindows('修改', "${"$"}{ctx}/${viewDir}/editPage?id=" + id, "600px");
			}
			function deleteInfo(id) {
				layer.confirm('您确定要删除该条记录吗?', {
					icon : 3,
					title : '提示'
				}, function(index) {
					${"$"}.post(basePath + "/${viewDir}/delete", {
						id : id
					}, function(data) {
						if (data.success) {
							succuceMsg(data.msg);
							queryTable();
							parent.layer.close(index);
						} else {
							errorMsg(data.msg);
						}
					}, "json");
					layer.close(index);
				});
			}
		</script>
</body>
</html>